<template>
	<view class="content">
		<view class="loading">
			<view class="logo">

			</view>
			<view class="title">

			</view>
			<view class="jiezhishijian">

			</view>
			<view class="xinyuan-box">
				<textarea cols="30" rows="10" v-model.trim="txt" placeholder="填写你的心愿吧" placeholder-class="plc"
					class="shurukuang" maxlength="30"></textarea>
			</view>
			<text class="tishiyu">仅可输入中文，不可超过30字数</text>
			<view class="tijiao-btn-box">
				<view class="tijiao-btn" @tap="tijiao"></view>
				<view class="fanhui-btn" @tap="fanhui"></view>
			</view>

			<view class="wenzi1">

			</view>
			<view class="lipin">

			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				txt: ''
			};
		},
		onShow() {
			if (!uni.getStorageSync('openid')) {
				uni.navigateTo({
					url: '../index/index'
				})
			}
			this.updatauserinfo()
		},
		methods: {
			tijiao() {

				/* if (/^[\u4e00-\u9fa5]+$/i.test(this.txt)) {

				} else {
					uni.showToast({
						title: '仅可输入中文',
						mask: true,
						icon: 'none'
					})
					return false
				} */
				if (this.txt !== '') {
					uniCloud.callFunction({
						name: 'addxinyuan',
						data: {
							openid: uni.getStorageSync('openid'),
							xinyuan: this.txt
						}
					}).then(res => {
						console.log(res)
						if (res.result.status == 1) {
							uni.showToast({
								title: res.result.msg,
								mask: true,
								icon: 'none'
							})
						} else {
							uni.showModal({
								content: res.result.msg,
								showCancel: false,
								success: (res) => {
									if (res.confirm) {
										uni.navigateTo({
											url: '../zan/zan'
										})
									}
								}
							})
						}
					})
				} else {
					uni.showToast({
						title: '请填写你的心愿吧',
						mask: true,
						icon: 'none'
					})

				}
			},
			updatauserinfo() {
				uniCloud.callFunction({
					name: 'get-userinfo',
					data: {
						openid: uni.getStorageSync('openid')
					}
				}).then(res => {
					uni.setStorageSync('userInfo', res.result.data[0])
				})
			},
			fanhui() {
				uni.navigateTo({
					url: '../choose/choose'
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: url('@/static/wangge.png') repeat-y center center;
		background-size: 100% auto;
		height: 1624rpx;
		background-attachment: fixed;
		// overflow-y: scroll;
	}

	/* page:before {
		content: '';
		width: 100%;
		height: 100%;
		background: url('@/static/kuang.png') no-repeat center center;
		background-size: 100% 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: -1;
	} */

	.loading {
		width: 100%;
		height: 100%;
		background: url('@/static/kuang.png') no-repeat center center;
		background-size: 100% 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		// margin-top: 136rpx;
	}

	.logo {
		width: 666rpx;
		height: 46rpx;
		background: url('@/static/logo.png') no-repeat center center;
		background-size: 100% 100%;
		margin-top: 60rpx;
	}

	.title {
		width: 562rpx;
		height: 110rpx;
		background: url('@/static/title.png') no-repeat center center;
		background-size: 100% 100%;
		margin-top: 118rpx;
	}

	.jiezhishijian {
		width: 402rpx;
		height: 40rpx;
		background: url('@/static/jiezhishijian.png') no-repeat center center;
		background-size: 100% 100%;
		margin-top: 94rpx;
	}

	.xinyuan-box {
		width: 488rpx;
		height: 284rpx;
		background: url('@/static/xinyuankuang.png') no-repeat center center;
		background-size: 100% 100%;
		margin-top: 74rpx;
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.tishiyu {
		width: 488rpx;
		text-align: right;
		font-size: 10px;
		color: #606060;
		margin-top: 16rpx;
	}

	.tijiao-btn {
		width: 220rpx;
		height: 82rpx;
		background: url('@/static/tijiao-btn.png') no-repeat center center;
		background-size: 100% 100%;
		// margin-top: 74rpx;
	}

	.wenzi1 {
		width: 590rpx;
		height: 120rpx;
		background: url('@/static/wenzi1.png') no-repeat center center;
		background-size: 100% 100%;
		margin-top: 48rpx;
	}

	.lipin {
		width: 436rpx;
		height: 112rpx;
		background: url('@/static/lipin.png') no-repeat center center;
		background-size: 100% 100%;
		margin-top: 64rpx;
	}

	.plc {
		color: #cccccc;
		font-size: 40rpx;
	}

	.shurukuang {
		width: 470rpx;
		height: 210rpx;
		border: #606060;
		margin-top: 62rpx;
		color: #0470fa;
		font-size: 40rpx;
	}

	.fanhui-btn {
		width: 220rpx;
		height: 80rpx;
		background: url('@/static/fanhui-btn.png') no-repeat center center;
		background-size: 100% 100%;
		margin: 0 24rpx;
	}

	.tijiao-btn-box {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		margin-top: 64rpx;
	}
</style>
